<template>
	<view>
		<view class="contact">
			<view class="contact_top">
				<view class="contact_fl">提现到</view>
				<view class="contact_fr"><text>{{list.bankAccount}}({{list.bankName}})</text><image src="../../static/iocn11.png"></image></view>
			</view>
			<view class="contact_box">
				<text>提现金额</text>
				<view>
					<image src="../../static/iocn34.png"></image>
					<input type="number" v-model="amount" placeholder="00.00" />
				</view>
			</view>
			<view class="contact_key">
				<view>可提现{{list.balanceAmt}}元  预计24小时到账</view>
				<view class="viewtop" @click="quanbtin(list)">全部提现</view>
			</view>
		</view>
		<view class="footer" @click="UserCash()">确认提现</view>
	</view>
</template>

<script>
	import {
		GetUserById,UserCash
	} from '@/public/Api/update.js'
	import {
		setValue,
		getValue
	} from '@/public/storeage/index.js'
	export default {
		data() {
			return {
				list:[],
				amount:''
			};
		},
		onShow() {
			this.GetUserById()
		},
		methods:{
			quanbtin(e){
				this.amount = e.balanceAmt
			},
			// 获取用户详情
			async GetUserById() {
				var id = getValue('id')
				try {
					const {
						data: res
					} = await GetUserById({
						id
					})
					this.list = res.result
				} catch (e) {}
			},
			
			// 用户提现
			async UserCash() {
				var userId = getValue('id')
				var amount = this.amount
				if (amount == "") {
				  uni.showToast({
				    title: "充值金额不能为空",
				    icon: "none",
				    duration: 2000,
				  });
				  return false;
				}
				try {
					const {
						data: res
					} = await UserCash({
						userId,
						amount
					})
					if (res.result.success == false) {
					  uni.showToast({
					    title: `${res.result.message}`,
					    icon: "error",
						});
						}else{
							uni.showToast({
							  title: '提现成功',
							  icon: "success",
							})
							setTimeout(()=>{
								uni.navigateBack({
									url:'pages/PersonalCenter/sjindex'
								})
							},500)
						
						}
				} catch (e) {}
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f7f7f7;
		padding: 20upx 15upx;
	}
	.contact{
		width: 100%;
		opacity: 1;
		border-radius: 17.52upx;
		background: #FFFFFF;
		box-shadow: 1.75upx 1.75upx 7.01upx 0px #cccccc, 1.75upx 1.75upx 7.01upx 0px #cccccc;
		margin: 0 auto;
		
		.contact_top{
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 30upx 40upx 15upx;
			.contact_fl{
				font-size: 31upx;
				color: #000;
				font-weight: bold;
			}
			.contact_fr{
				display: flex;
				align-items: center;
				text{
					font-size: 28upx;
					color: #000;
					font-weight: bold;
				}
				image{
					width: 30upx;
					height: 30upx;
				}
			}
		}
		
		.contact_box{
			padding: 40upx;
			border-bottom: 1upx solid #e5e5e5;
			border-top: 1upx solid #e5e5e5;
			text{
				display: block;
				font-size: 35upx;
				font-weight: bold;
			}
			view{
				display: flex;
				align-items: center;
				padding-top: 40upx;
				image{
					width: 40upx;
					height: 40upx;
				}
				input{
					font-size: 38upx;
					font-weight: bold;
					padding-left: 10upx;
				}
			}
		}
		.contact_key{
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 15upx 30upx 30upx;
			view{
				font-size: 24upx;
				color: #808080;
			}
			.viewtop{
				color: #EF4D3D;
			}
		}
	}
	
	.footer{
		width: 648upx;
		height: 72upx;
		text-align: center;
		line-height: 72upx;
		border-radius: 20upx;
		margin: 0 auto;
		margin-top: 30upx;
		color: #fff;
		background-color: #EF4D3D;
		font-size: 32upx;
		font-weight: bold;
	}
</style>
